import React from 'react';
import Cnav from '../../cnav/Cnav';

class AthleteBanner extends React.Component {
    constructor(props) {
        super(props);
        this.displayName = 'AthleteBanner';
        this.state= {
            data: props.data,
            name: "顾晨阳",
            club: "沈阳第一",
            imgSrc:"",
            rank: "11",
            goalsSum: '32',
            goalsCurrent: "16"
        }
    }

    componentWillReceiveProps(nextProps) {
        this.setState({
            data: nextProps.data
        });
    }


    render() {
        console.log( "*******AthleteBanner ready to render*****" );
        console.log(this.state.data);

        return (
            <div className="banner athleteBanner">
                <img className="logo" src={this.state.data.imgSrc} />
                <p>
                 {this.state.data.name}<br />
                 {this.state.data.club}
                </p>
                <div className="athleteBannerInfo">
                    <p>
                         <span>{this.state.data.rank}</span>
                         射手榜排名
                    </p>
                    <p>
                        <span>{this.state.data.goalsSum}</span>
                        总进球数
                    </p>
                    <p>
                        <span>{this.state.data.goalsCurrent}</span>
                        当前赛季进球数
                    </p>
                </div>
                <Cnav mode="athlete"  />
            </div>
        );
    }
}

export default AthleteBanner;
